<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/include/tag.jsp"%>
<%@ include file="/WEB-INF/include/common.jsp"%>

<link rel="stylesheet" href="${ctx}/statics/css/custom_theme.css" />

<div class="modal fade" id="userRoleModel" tabindex="-1" role="dialog" aria-labelledby="userRoleModelLabel" aria-hidden="true" data-backdrop="false">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                	<span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="userRoleModelLabel">${subTitle}</h4>
            </div>
            <div class="modal-body">
        		<div id="userRoleModel_modal_body"></div>
            </div>
        </div>
         
    </div>
</div>

<!-- 模态窗口 -->
<div class="modal fade" id="userModel" tabindex="-1" role="dialog" aria-labelledby="userModelLabel" aria-hidden="true" data-backdrop="false">
  <div class="modal-dialog" >
        <div class="modal-content">
            <div class="modal-header">
            	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
                	<span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" >添加活动</h4>
            </div>
            <div class="modal-body">
            	<form id="act_edit_form"  class="form-horizontal">
			        <input type="hidden" id="id" name="id">
			        <div class="form-group">
			        	<label class="control-label col-sm-3">省份：</label>
			        	<div class="col-sm-8">
			        		<select name="city" id="edit_city" class="form-control">
			                  <c:forEach var="province" items="${provinceList}" varStatus="status" >
								<option value="${province.id }">${province.provinceName }</option>
			                  </c:forEach>
							</select>
						</div>
		        	</div>
			        <div class="form-group">
			        	<label class="control-label col-sm-3">活动类型：</label>
			        	<div class="col-sm-8">
			        		<select id="activities_type" name="activitiesType" class="form-control">
			        		<option value="0">--请选择--</option>
			                  <c:forEach var="activities" items="${activitiesList}" varStatus="status" >
								<option value="${activities.type }">${activities.type }</option>
			                  </c:forEach>
							</select>
						</div>
		        	</div>
		        	<div class="form-group">
			        	<label class="control-label col-sm-3">品牌名称：</label>
			        	<div class="col-sm-8">
			        		<select name="brandName" id="edit_brandId" class="form-control">
			        		<option value="0">--请选择--</option>
			                  <c:forEach var="brand" items="${carBrandList}" varStatus="status" >
								<option value="${brand.id }">${brand.name }</option>
			                  </c:forEach>
							</select>
						</div>
		        	</div>
		        	<div class="form-group">
			        	<label class="control-label col-sm-3">车系名称：</label>
			        	<div class="col-sm-8">
			        		<select name="seriesName" id="edit_seriesId" class="form-control">
			                  <option value="0">--请选择--</option>
							</select>
						</div>
		        	</div>
		        	<div class="form-group">
			        	<label class="control-label col-sm-3">车型名称：</label>
			        	<div class="col-sm-8">
			        		<select name="modelName" id="edit_modelId" class="form-control">
			                  <option value="0">--请选择--</option>
							</select>
						</div>
		        	</div>
		        	<div class="form-group">
			        	<label class="control-label col-sm-3" >开始时间：</label>
			        	<div class="col-sm-8">
			            	<input type="text" class="form-control" name="beginTime" id="beginTime" required="true" />
			       		 </div>
			        </div>
			        <div class="form-group">
			        	<label class="control-label col-sm-3" >结束时间：</label>
			        	<div class="col-sm-8">
			            	<input type="text" class="form-control" name="endTime" id="endTime" required="true" />
			       		 </div>
			        </div>
			        <div class="form-group">
			        	<label class="control-label col-sm-3" id="youhui_du">优惠金额：</label>
			        	<div class="col-sm-8">
				            <input type="text"  id="activityRate" name="activityRate" class="form-control">
			        	</div>
			        </div>
			    </form>
            </div>
            <div class="modal-footer">
            	<button type="button" class="btn btn-sm btn-primary" id="userModelBtn">确定</button>
                <button type="button" class="btn btn-sm btn-default" data-dismiss="modal" id="Close">关闭</button>
            </div>
        </div>
   </div>
</div>
<div id="main-content">
	<div class="row" >
		<div class="col-md-12">
			<div class="panel panel-default">
				<div class="panel-heading">${title}</div>
				<!-- /.panel-heading -->
				<div class="panel-body" >
					<div class="row">
						<div class="col-xs-12">
							<!-- PAGE CONTENT BEGINS -->
							<form class="form-horizontal" role="form" id="user_search_form">
								<div class="col-sm-9">
									<label class="col-sm-2 control-label">活动类型</label>
									<div class="col-sm-3">
										<input id="search_realName" name="activitiesType" type="text"/> 
									</div>
						  
								</div>
								<div class="col-sm-3">
									<div class="col-sm-4">
										<button class="btn btn-sm btn-info" type="submit">
											<i class="icon-search nav-search-icon"></i>查询
										</button> 
									</div>
									<div class="col-sm-4"> 
										<button type="button" class="btn btn-success btn-sm" onclick="addData()"><i class="icon-plus bigger-110"></i>新增</button>
									</div>
									<div class="col-sm-4">
										<button class="btn btn-sm btn-primary" type="reset"	>
										<i class="icon-undo bigger-110"></i>清除
									</button>
									</div>
								</div>
							</form>
						</div>
					</div>
					<table id="user_table" class="table table-bordered table-hover">
					</table>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
function youhui_du(){
	var youhui_du = $("#activities_type").val();
	if(youhui_du=="优惠"){
		$("#youhui_du").attr("data-value",0);
		$("#youhui_du").text("优惠金额：")
	}else if( youhui_du=="折扣"){
		$("#youhui_du").attr("data-value",1);
		$("#youhui_du").text("折扣率(%)：")
	}
}
$(function(){
	$("#activities_type").change(function(){
		youhui_du();
	});
	$('#user_table').bootstrapTable({
		url: '${ctx}/admin/activities/queryActCarList.do',
		pagination: true,
		paginationLoop: false,
		smartDisplay: false,
	    pageSize: 10,
	    pageList: [10, 20, 50, 100],
	    sidePagination: 'server',
	    paginationNextText:'下一页',
	    paginationPreText:'上一页',
	    cache: false,
		columns: [
	   {
		field: '',
		title: '操作',
		align: 'center',
		width :'120px',
		formatter: function(value, row, index){
			return '<button class="btn btn-xs btn-info" id="editData" title="编辑"><i class="icon-edit bigger-130"></i></button>'
			    +'<button class="btn btn-xs btn-danger" id="deleteData" title="删除"><i class="icon-trash bigger-130"></i></button>';
		
		},
		events: {
			'click #deleteData':deleteData,
			'click #editData':editData,
		  }
 		},{
			field: 'id',
			title: 'ID',
			align: 'center'
		},{
			field: 'activitiesType',
			title: '活动类型',
			align: 'center'
		},{
			field: 'adminProvince.provinceName',
			title: '区域',
			align: 'center'
		},{
			field: 'beginTime',
			formatter:function(value,row,index){
				var date = new Date(value);
				//date.getFullYear();//获取完整的年份(4位,1970)
				//date.getMonth();//获取月份(0-11,0代表1月,用的时候记得加上1)
				//date.getDate();//获取日(1-31)
				
				return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();
			},
			title: '开始时间',
			align: 'center'
		},{
			field: 'endTime',
			formatter:function(value,row,index){
				var date = new Date(value);
				//date.getFullYear();//获取完整的年份(4位,1970)
				//date.getMonth();//获取月份(0-11,0代表1月,用的时候记得加上1)
				//date.getDate();//获取日(1-31)
				
				return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();
			},
			title: '结束时间',
			align: 'center'
		},{
			field: 'carType',
			formatter:function(value,row,index){
				var type = row.carType;
				if(type=="品牌"){
					if(row.brand!=null){
						return type+"("+row.brand.name+")";
					}else{
						return type+'<span style="color:red">'+"(该品牌已被删除)"+"</span>";
					}
				}else if(type=="车系"){
					if(row.series!=null){
						return type+"("+row.series.name+")";
					}else{
						return type+'<span style="color:red">'+"(该车系已被删除)"+"</span>";
					}
				}else if(type=="车型"){
					if(row.model!=null){
						return type+"("+row.model.name+")";
					}else{
						return type+'<span style="color:red">'+"(该车型已被删除)"+"</span>";
					}
				}
				
			},
			title: '品牌/车系/车型',
			align: 'center'
		},{
			field: 'carId',
			title: '品牌/车系/车型id',
			align: 'center'
		},{
			field: 'activityRate',
			title: '优惠度',
			align: 'center',
			formatter:function(value,row,index){
				var rateType = row.activitiesType;
				if(rateType=="折扣"){
					value += "%";
				}else{
					value+="元";
				}
				return value;
			}
		}],
		queryParams: function(params){
			//console.log(params);
			//params.usreId
			$.extend(params,$("#user_search_form").serializeJson());
			return params;
		}
	});

	$('#user_table').on('mouseenter','.pannel_a_title',function () {
        $(this).popover('show');
	});
	
	$.validator.addMethod("unequal",function(value,element,param){  
		return this.optional( element ) || value != param;
	},"请选择");
	//添加和编辑请求验证
	$("#act_edit_form").validate({
		 rules: {
			//loginName:{required:true,maxlength:30},
			activityRate:{required:true,number : true},
			brandName : {unequal : 0},
			activitiesType : {unequal : 0},
		},
		messages : {
			activityRate:{required:"必填",number:"只能填数字"},
			//realName:{required:"必填",maxlength:"最大长度30"},
		}, 
		submitHandler: function(form) {
			var date1=$("#beginTime").val();
			var date2=$("#endTime").val();
			if(date2<date1){
				alert("结束时间不能在开始时间之前");
				return;
			}
			var activitiesType = $("#activities_type").val();
			var rate = $("#activityRate").val();
			if(activitiesType=="折扣"){
				if(rate<=0 || rate>100){
					alert("请填写0到1之间的数字");
					return;
				}
			}
			var carType;//品牌/车系/车型
			var carId; // 品牌/车系/车型id
			var brandName=$("#edit_brandId").val();
			var seriesName=$("#edit_seriesId").val();
			var modelName=$("#edit_modelId").val();
			if(modelName==0){
				if(seriesName==0){
					carType="品牌";
					carId=$('#edit_brandId option:selected').val();
				}else{
					carType="车系";
					carId=$('#edit_seriesId option:selected').val();
				}
			}else{
				carType="车型";
				carId=$('#edit_modelId option:selected').val();
			}
			
			$("#userModel").prop("disabled",true);
    		$(form).ajaxSubmit({
    			type:"post",
    			dataType:"json",
    			url:"${ctx}/admin/activities/saveOrUpdateActivitiesCar.do?carType="+carType+"&carId="+carId,
    			success:function(data){
    				if(data.success==true){
    					$('#userModel').modal('hide') 
    					$('#user_table').bootstrapTable('refresh');
    				}else{
    					alert(data.errorMessage);
    				}
    				$("#userModel").prop("disabled",false);
                }  
            });
		}
	});
	
	//提交用户信息
	$("#userModel").on('click','#userModelBtn',function(){
		$("#act_edit_form").submit();
	});
	
	//搜索角色
	$("#user_search_form").submit(function(e){
		e.preventDefault();
		$('#user_table').bootstrapTable('refresh');
	});
	
	$("#edit_brandId").change(function() {
		changeSeries($(this).val(), "edit_seriesId");
	});
	
	$("#edit_seriesId").change(function() {
		changeModel($(this).val(), "edit_modelId");
	});
	
});

function changeSeries(value, id) {
	var brandId = value;
	$.ajax({
		url : "${ctx}/business/car/getSeriesListByBrandId.do",
		type : "POST",
		data : {
			"brandId" : brandId
		},
		success : function(data) {
			$("#edit_modelId").val("0");
			
			var html = '<option value="0">--请选择--</option>';
			var list = data.rows;
			list.forEach(function(val, index, arr) {
				html += '<option value="'+val.id+'">' + val.name
						+ '</option>';
			});
			$("#" + id).html(html);

			$("#act_edit_form select[name=modelName]").html('<option value="0">--请选择--</option>');
		}
	});
}

function changeModel(value, id) {
	var seriesId = value;
	$.ajax({
		url : "${ctx}/admin/activities/getSeriesListBySeriesId.do",
		type : "POST",
		data : {
			"seriesId" : seriesId
		},
		success : function(data) {
			
			var html = '<option value="0">--请选择--</option>';
			var list = data.rows;
			list.forEach(function(val, index, arr) {
				html += '<option value="'+val.id+'">' + val.name
						+ '</option>';
			});
			$("#" + id).html(html);

		}
	});
}

//添加
function addData(e, v, row) {
	$("#userModel .modal-title").empty().html("添加车型活动类型");
	$("#act_edit_form").resetForm();
	$("#act_edit_form input[name=id]").val("");
	$("#act_edit_form select[name=activitiesType]").val("0");
	$("#act_edit_form select[name=city]").val("0");
	$("#act_edit_form select[name=brandName]").val("0");
	$("#act_edit_form select[name=seriesName]").html('<option value="0">--请选择--</option>');
	$("#act_edit_form select[name=modelName]").html('<option value="0">--请选择--</option>');
	$("#act_edit_form input[name=beginTime]").val("");
	$("#act_edit_form input[name=endTime]").val("");
	$("#act_edit_form input[name=activityRate]").val("");
	
	$('#userModel').modal('show');
}

//编辑
function editData(e, v, row) {
	$("#userModel .modal-title").empty().html("修改车型活动类型");
	$("#act_edit_form").resetForm();
	$("#act_edit_form input[name=id]").val(row.id);
	$("#act_edit_form select[name=activitiesType]").val(row.activitiesType);//活动类型
	$("#act_edit_form select[name=city]").val(row.adminProvince.id);
	youhui_du();
	var type = row.carType;
	if(type=="品牌"){
		$("#act_edit_form select[name=brandName]").val(row.carId);
		
		$.ajax({//设置车系下拉框选项
			url : "${ctx}/business/car/getSeriesListByBrandId.do",
			type : "POST",
			data : {
				"brandId" : row.carId
			},
			success : function(data) {
				var html = '<option value="0">--请选择--</option>';
				var list = data.rows;
				list.forEach(function(val, index, arr) {
					html += '<option value='+val.id+'>' + val.name+ '</option>';
				});
				$("#edit_seriesId").html(html);

			}
		});
		
		$("#act_edit_form select[name=modelName]").html('<option value="0">--请选择--</option>');
	}else if(type=="车系"){
		$.ajax({//设置车系下拉框选项
			url : "${ctx}/business/car/getSeriesListByBrandId.do",
			type : "POST",
			data : {
				"brandId" : row.brand.id
			},
			success : function(data) {
				var html = '<option value='+row.carId+'>'+ row.series.name+ '</option>';
				var list = data.rows;
				list.forEach(function(val, index, arr) {
					if(row.carId!=val.id){//去掉默认选择的 防止重复
						html += '<option value='+val.id+'>' + val.name+ '</option>';
					}
				});
				$("#edit_seriesId").html(html);

			}
		});
		
		$.ajax({//设置车型下拉框选项
			url : "${ctx}/admin/activities/getSeriesListBySeriesId.do",
			type : "POST",
			data : {
				"seriesId" : row.carId
			},
			success : function(data) {
				var html = '<option value="0">--请选择--</option>';
				var list = data.rows;
				list.forEach(function(val, index, arr) {
					html += '<option value='+val.id+'>' + val.name+ '</option>';
				});
				$("#edit_modelId").html(html);

			}
		});
		$("#act_edit_form select[name=brandName]").val(row.brand.id);
		
	}else if(type=="车型"){
		$.ajax({//设置车型下拉框选项
			url : "${ctx}/admin/activities/getSeriesListBySeriesId.do",
			type : "POST",
			data : {
				"seriesId" : row.series.id
			},
			success : function(data) {
				var html = '<option value='+row.carId+'>'+ row.model.name+ '</option>';
				var list = data.rows;
				list.forEach(function(val, index, arr) {
					if(row.model.id!=val.id){//去掉默认选择的 防止重复
						html += '<option value='+val.id+'>' + val.name+ '</option>';
					}
				});
				$("#edit_modelId").html(html);

			}
		});
		
		$.ajax({//设置车系下拉框选项
			url : "${ctx}/business/car/getSeriesListByBrandId.do",
			type : "POST",
			data : {
				"brandId" : row.brand.id
			},
			success : function(data) {
				var html = '<option value='+row.carId+'>'+ row.series.name+ '</option>';
				var list = data.rows;
				list.forEach(function(val, index, arr) {
					if(row.series.id!=val.id){//去掉默认选择的 防止重复
						html += '<option value='+val.id+'>' + val.name+ '</option>';
					}
				});
				$("#edit_seriesId").html(html);

			}
		});
		$("#act_edit_form select[name=brandName]").val(row.brand.id);//品牌选择下拉框
	}
	
	var date1 = new Date(row.beginTime);//转换时间格式为yyyy-mm-dd
	var date2 = new Date(row.endTime);
	$("#beginTime").datetimepicker('update',date1);
	$("#endTime").datetimepicker('update',date2);
	$("#act_edit_form input[name=activityRate]").val(row.activityRate);//优惠度
	
	$('#userModel').modal('show');
}

//删除用户
function deleteData(e, v, row) {
	if(row.dictItemList!=""){
		if(confirm("确定删除吗？")){
			$.ajax({
		        url: "${ctx}/admin/activities/deleteActivitiesCar.do",
		        type: "POST",
		        data: {
		            "id": row.id
		        }, 
		        success: function (data) {
		        	if(data.success){
		        		$('#user_table').bootstrapTable('refresh');
		            }else {
		            	alert(data.errorMessage);
		            }
		        }
	  		});
		}
	}
	
}

$("#beginTime").datetimepicker({
    minView: "month",
    language:  'zh-CN',
    format: 'yyyy-mm-dd',
    todayHighlight: true,
    todayBtn: true,
    autoclose: true,
   // endDate : new Date() 禁止今天之后的日期
});
$("#endTime").datetimepicker({
    minView: "month",
    language:  'zh-CN',
    format: 'yyyy-mm-dd',
    todayHighlight: true,
    todayBtn: true,
    autoclose: true,
});

</script>